<template>
	<view>
		<view class="card">
			<view>{{companyInfo.yardName}}</view>
		</view>
		<view class="card">
			<view class="title">打卡时间</view>
			<view>
				<view>打卡时间：{{companyInfo.upTime}}——{{companyInfo.downTime}}</view>
				<view>工作日：{{timeclockWeek}}</view>
			</view>
		</view>
		<view class="card">
			<view class="title">打卡范围</view>
			<view>
				<view>打卡地点：{{companyInfo.yardName}}</view>
				<view>打卡范围：{{companyInfo.timeclockDisance}}米</view>
			</view>

		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onUnload
	} from '@dcloudio/uni-app';
	import {
		dailyTimeclockConfig
	} from "@/api"
	import {
		USER_INFO_KEY
	} from "@/enums/cacheEnum"
	const userInfo = ref(cache.get(USER_INFO_KEY))
	const companyInfo = ref('')
	const week = ref([{
			name: '星期一',
			id: '1'
		},
		{
			name: '星期二',
			id:'2'
		},
		{
			name: '星期三',
			id: '3'
		},
		{
			name: '星期四',
			id: '4'
		},
		{
			name: '星期五',
			id: '5'
		},
		{
			name: '星期六',
			id: '6'
		},
		{
			name: '星期日',
			id: '7'
		},
	])
	const timeclockWeek=ref('')
	onLoad(async () => {
		const result = await dailyTimeclockConfig({
			yardId: userInfo.value.yardId
		})
		companyInfo.value = result.data 
		timeclockWeek.value = await dealweek(result.data.timeclockWeekday) 

	})
	const dealweek=(data)=>{
		let timeclockWeekday = week.value.filter((v, i) => {
			console.log(v.id)
			if (data.includes(v.id)) {
				return true
			} 
		}).map(v=>{
			return v.name
		})
		return timeclockWeekday.join(",")
	}
</script>

<style lang="scss" scoped>
	.card {
		width: 690rpx;
		background: #fff;
		box-sizing: border-box;
		margin: 20rpx auto;
		padding: 20rpx;
		font-size: 26rpx;
		color: #6d6d6d;
		line-height: 2;
		border-radius: 20rpx;

		.title {
			padding-bottom: 20rpx;
			font-weight: 500;
			font-size: 30rpx;
			border-bottom: 1px solid #e1e1e1;
			margin-bottom: 20rpx;
			color: #3d3d3d;
		}
	}
</style>